import { React,  useEffect,  useState } from 'react';

function App() {
    const [count, setCount] = useState(0)

    // 副作用函数
    useEffect(() => { // 异步执行
       console.log( `useEffect --- 你点击了 ${count}次`);
    })
            return (
            <div>
                <p>当前点击次数: {this.state.count}</p>
                <button onClick={() => {setCount + 1}}>Click</button>
            </div>
        )
}


// class App extends Component {
//     constructor(props) {
//         super(props)
//         this.state = {
//             count: 0
//         }
//     }

//     componentDidMount() {
//         console.log(`componentDidMount --- 你点击 ${this.state.count}次`);
//     }

//     componentDidUpdate() { // 会在状态变更之后执行
//         console.log(`componentDidUpdate --- 你点击 ${this.state.count}次`);

//     }


//     render() {
//         return (
//             <div>
//                 <p>当前点击次数: {this.state.count}</p>
//                 <button onClick={this.addCount.bind(this)}>Click</button>
//             </div>
//         )
//     }
// }